<template>
    <div>
        <el-upload class="upload-demo" action="" multiple :http-request="importExcel">
            <el-button size="small" type="primary">点击上传</el-button>
            <div slot="tip" class="el-upload__tip">只能上传Excel文件，且不超过500kb</div>
        </el-upload>

        <template>
            <el-table :data="calculateBuilding" border stripe :summary-method="getSummaries" show-summary height="800"
                style="width: 100%" :header-cell-style="{ 'text-align': 'center' }" :cell-style="{ 'text-align': 'center' }">
                <el-table-column fixed prop="number" label="楼号">
                </el-table-column>
                <el-table-column prop="sum_count" label="套数">
                </el-table-column>
                <el-table-column prop="residence" label="普通住宅面积" :formatter="stateFormat">
                </el-table-column>
                <el-table-column prop="nresidence" label="非普通住宅面积" :formatter="stateFormat">
                </el-table-column>
                <el-table-column prop="up_storeroom" label="地上储藏室面积" :formatter="stateFormat">
                </el-table-column>
                <el-table-column prop="down_storeroom" label="地下储藏室面积" :formatter="stateFormat">
                </el-table-column>
                <el-table-column prop="up_business" label="地上商业面积" :formatter="stateFormat">
                </el-table-column>
                <el-table-column prop="down_business" label="地下商业面积" :formatter="stateFormat">
                </el-table-column>
                <el-table-column prop="up_carport" label="地上其他面积" :formatter="stateFormat">
                </el-table-column>
                <el-table-column prop="down_carport" label="地下车库面积" :formatter="stateFormat">
                </el-table-column>
                <el-table-column prop="up_mating" label="地上配套面积" :formatter="stateFormat">
                </el-table-column>
                <el-table-column prop="down_mating" label="地下配套面积" :formatter="stateFormat">
                </el-table-column>
                <el-table-column prop="sum_sold_count" label="已售套数">
                </el-table-column>
                <el-table-column prop="sold_residence" label="已售普通住宅面积" :formatter="stateFormat">
                </el-table-column>
                <el-table-column prop="sold_nresidence" label="已售非普通住宅面积" :formatter="stateFormat">
                </el-table-column>
                <el-table-column prop="sold_up_storeroom" label="已售地上储藏室面积" :formatter="stateFormat">
                </el-table-column>
                <el-table-column prop="sold_down_storeroom" label="已售地下储藏室面积" :formatter="stateFormat">
                </el-table-column>
                <el-table-column prop="sold_up_business" label="已售地上商业面积" :formatter="stateFormat">
                </el-table-column>
                <el-table-column prop="sold_down_business" label="已售地下商业面积" :formatter="stateFormat">
                </el-table-column>
                <el-table-column prop="sold_up_carport" label="已售地上其他面积" :formatter="stateFormat">
                </el-table-column>
                <el-table-column prop="sold_down_carport" label="已售地下车库面积" :formatter="stateFormat">
                </el-table-column>
                <el-table-column prop="sum_count-sum_sold_count" label="未售套数">
                </el-table-column>
                <el-table-column prop="nsold_residence" label="未售普通住宅面积" :formatter="stateFormat">
                </el-table-column>
                <el-table-column prop="nsold_nresidence" label="未售非普通住宅面积" :formatter="stateFormat">
                </el-table-column>
                <el-table-column prop="nsold_up_storeroom" label="未售地上储藏室面积" :formatter="stateFormat">
                </el-table-column>
                <el-table-column prop="nsold_down_storeroom" label="未售地下储藏室面积" :formatter="stateFormat">
                </el-table-column>
                <el-table-column prop="nsold_up_business" label="未售地上商业面积" :formatter="stateFormat">
                </el-table-column>
                <el-table-column prop="nsold_down_business" label="未售地下商业面积" :formatter="stateFormat">
                </el-table-column>
                <el-table-column prop="nsold_up_carport" label="未售地上其他面积" :formatter="stateFormat">
                </el-table-column>
                <el-table-column prop="nsold_down_carport" label="未售地下车库面积" :formatter="stateFormat">
                </el-table-column>
                <el-table-column prop="income_residence" label="普通住宅收入" :formatter="stateFormat">
                </el-table-column>
                <el-table-column prop="income_nresidence" label="非普通住宅收入" :formatter="stateFormat">
                </el-table-column>
                <el-table-column prop="income_up_storeroom" label="地上储藏室收入" :formatter="stateFormat">
                </el-table-column>
                <el-table-column prop="income_down_storeroom" label="地下储藏室收入" :formatter="stateFormat">
                </el-table-column>
                <el-table-column prop="income_up_business" label="地上商业收入" :formatter="stateFormat">
                </el-table-column>
                <el-table-column prop="income_down_business" label="地下商业收入" :formatter="stateFormat">
                </el-table-column>
                <el-table-column prop="income_up_carport" label="地上车库收入" :formatter="stateFormat">
                </el-table-column>
                <el-table-column prop="income_down_carport" label="地下车库收入" :formatter="stateFormat">
                </el-table-column>
                <el-table-column prop="sum_income" label="合计" :formatter="stateFormat">
                </el-table-column>


                <el-table-column prop="height_residence" label="普通住宅层高">
                </el-table-column>
                <el-table-column prop="height_nresidence" label="非普通住宅层高">
                </el-table-column>
                <el-table-column prop="height_up_storeroom" label="地上储藏室层高">
                </el-table-column>
                <el-table-column prop="height_down_storeroom" label="地下储藏室层高">
                </el-table-column>
                <el-table-column prop="height_up_business" label="地上商业层高">
                </el-table-column>
                <el-table-column prop="height_down_business" label="地下商业层高">
                </el-table-column>
                <el-table-column prop="height_up_carport" label="地上车库层高">
                </el-table-column>
                <el-table-column prop="height_down_carport" label="地下车库层高">
                </el-table-column>
                <el-table-column prop="height_up_mating" label="地上配套用房层高">
                </el-table-column>
                <el-table-column prop="height_down_mating" label="地下配套用房层高">
                </el-table-column>
            </el-table>
        </template>
    </div>
</template>

<script>
import { getToken } from '@/utils/auth'
import calculateApi from '@/api/calculate'


export default {
    data() {
        return {
            calculate_id: '',
            calculateBuilding: [],


        }
    },
    methods: {

        //上传文件
        importExcel(file) {

            const formData = new FormData()
            formData.append('excel', file.file)
            formData.append('type', 'building')

            this.$axios({
                method: 'post',
                url: '/calculate_excel/add_excel/' + this.calculate_id,
                headers: { 'Authorization': 'Bearer ' + getToken() },
                timeout: 30000,
                data: formData
            }).then(res => {

                this.handleSuccess();

            })

        },

        //上传成功后的回调
        handleSuccess() {
            this.getCalculateBuildingList();
        },



        //获取收入面积汇总表数据
        getCalculateBuildingList() {
            calculateApi.getCalculateBuildingList(this.calculate_id).then(response => {
                this.calculateBuilding = response.data.list;
            })
        },


    },

    created() {
        var query = this.$route.query;
        if (query.id) {
            this.calculate_id = query.id;
        }

        this.getCalculateBuildingList();
    },
}
</script>

<style></style>